@charset "utf-8";

/* 
|----------------------
|   全局设置
|----------------------
*/
* {transition: all .3s;}
@font-face {
    font-family: Alibaba_PuHuiTi;
    src: url("../font/Alibaba_PuHuiTi_2.0_65_Medium_65_Medium.ttf");
}
body {position: relative; font-size: 14px; font-family: "Alibaba_PuHuiTi",'SimHei','SimSun'; line-height: 1;}

.flex {display: flex;display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;flex-wrap: wrap;-webkit-flex-wrap: wrap;}
.position {position: relative;}
.overflow {overflow: hidden;}
.background {background-position: center;background-repeat: no-repeat;background-size: cover;}
.container { max-width: 1430px; margin: 0 auto; padding-left: 15px; padding-right: 15px;}
@media (max-width:1440px) {
    .container {padding-left: 15px;padding-right:15px;}
}
.padding {padding-top: 60px;padding-bottom: 60px;}
.padding-top{padding-top: 50px;}
@media (max-width:768px) {
    .padding {padding-top: 30px;padding-bottom: 30px;}
    .padding-top{padding-top: 30px;}
}

/* 
|----------------------
|   主题色设置
|----------------------
*/
:root {
    /* 主色调 */
    --default: #0000ff;
    /* 辅助色 */
    --fuColor: #008CD6;
}

/* 
|----------------------
|   字体图标
|----------------------
*/


@font-face {
    font-family: 'iconfont';  /* Project id 2814389 */
    src: url('//at.alicdn.com/t/font_2814389_or56ophxqda.woff2?t=1641284444987') format('woff2'),
         url('//at.alicdn.com/t/font_2814389_or56ophxqda.woff?t=1641284444987') format('woff'),
         url('//at.alicdn.com/t/font_2814389_or56ophxqda.ttf?t=1641284444987') format('truetype');
  }

.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* 
|----------------------
|   header
|----------------------
*/

.header { padding: 0 0 0 30px;}
@media (max-width:1200px) {
    .header { padding: 10px 15px;}
}

/*  */
.header-box{justify-content: space-between; align-items: center;}
.header-item{align-items: stretch;}
/* logo */
.header-logo{display: inline-block;}
.header-logo img {
    height: 40px;
    image-rendering:-moz-crisp-edges;
	image-rendering:-o-crisp-edges;
	image-rendering:-webkit-optimize-contrast;
	image-rendering: crisp-edges;
	-ms-interpolation-mode:nearest-neighbor;
}


.header-lang{ text-align: right;align-items: center;margin-left: 22px;}
.header-lang a{ padding:0 10px; font-size: 16px;}
.header-lang a:nth-child(1) {position: relative;color: var(--default);}
.header-lang a:nth-child(1)::before {position: absolute; top: 3px; right: 0; content: ''; height: 14px; width: 1px; background-color: #ccc;}
@media (max-width:1000px) {
    
}
@media(max-width: 1000px) {
    .header-logo img {height: 30px;}
    .header-lang {margin-left: 0;margin-right: 5px;}
}


/* nav */
.header-nav>ul>li { position: relative; padding-right: 50px;}
.header-nav>ul>li>a {position: relative; display: block; padding: 23px 0; line-height: 40px; font-size: 16px; border-bottom: 4px solid transparent}
.header-nav>ul>li>a i{position: absolute; top: 10px; right: -23px; font-size: 20px;}
.header-nav>ul>li.current-menu-item>a,
.header-nav>ul>li:hover>a{border-bottom-color: var(--default); color: var(--default);}
.header-nav>ul>li.current-menu-item>a i,
.header-nav>ul>li:hover>a i{ color: var(--default);}
.header-nav>ul>li.rred>a {background: #e4393c; color: #fff; padding-left: 10px; padding-right: 10px;}


@media (max-width:1200px) {
    .header-nav{display: none;}
}

.header-nav .sub-menu{position: absolute; top: 64px; left: 50%; z-index: 9; margin-left: -30px; background-color: #fff;overflow: hidden; visibility: hidden; opacity: 0; transform: translateY(5px); border-radius: 4px;}
.header-nav .sub-menu li a{display: block; padding: 0 15px; line-height: 50px; white-space: nowrap; }
.header-nav .sub-menu li a:hover{ color: var(--default);background-color: #eee;}
.header-nav>ul>li:hover .sub-menu{ visibility: visible; opacity: 1; transform: translateY(0);}

/*  */
.header-search{padding-right: 0; align-items: center;}
.header-search i{font-size: 24px;}
@media (max-width:1200px) {
    .header-search{padding-right: 15px;}
}
@media (max-width:1000px) {
    .header-search {padding-right: 0;}
    .header-lang a {margin-top: 2px;}
}
/*  */
.header-tel{ position: relative; padding: 0 30px 0 70px; font-size: 18px; color: #fff; align-items: center; background: linear-gradient(to right, var(--default), #0874DC );}
.header-tel::before{position: absolute; top: 0; left: 0; content: ''; width: 0; height: 0;
border-bottom: 100px solid transparent; 
border-top: 100px solid #fff ; 
border-right: 60px solid transparent;}
.header-tel i{display: inline-block; font-size: 24px; }

@media (max-width:1200px) {
    .header-tel{display: none;}
}
/* navbar */
.navbar {width: 18px;height: 30px;padding: 8px 0;cursor: pointer;display: none;}
.navbar span {display: block;width: 18px;height: 2px;background-color: var(--default);}
.navbar span:nth-child(2) {position: relative;margin: 5px 0;}
@media(max-width: 1200px) {
    .navbar {display: block;}
}




/* mobile */
.mobile-backgroud {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, .9);z-index: 99;visibility: hidden; opacity: 0;}
/*  */
.mobile-logo{ margin-left: 15px; }
.mobile-logo img{max-width: 100%; height: 30px;}

/* close */
.mobile-close {position: absolute;top: 12px;right: 15px;z-index: 9;}
.mobile-close span {position: relative; display: inline-block; width: 22px; height: 22px; cursor: pointer;}
.mobile-close span::before,
.mobile-close span::after{position: absolute; top: 50%; left: 0; content: ''; width: 100%; height: 2px; background-color: #333; transition: .3s; }
.mobile-close span::before{transform: rotate(45deg);}
.mobile-close span::after{transform: rotate(-45deg);}

/* mobile-nav */
.mobile-nav-box {display: flex;justify-content: flex-start;width: 100%; height: 100%;overflow: hidden;}
.mobile-nav-backgroud{width: 100%; height: 100%; padding: 10px 0; background-color: #fff; overflow: hidden; }
.mobile-nav-scroll{width: 100%; height: 100%; overflow-y: auto; overflow-x: hidden;  visibility: hidden; opacity: 0; transform: translateX(-50px);}
.mobile-nav { width: 100%; margin-top: 15px; padding: 0 15px;}
.mobile-nav>ul{display: block;}
.mobile-nav>ul>li{ position: relative; border-bottom: 1px solid #eee;}
.mobile-nav>ul>li>a i{display: none;}
.mobile-nav>ul>li span{position: absolute; top: 12px; right: 0; content: ''; width: 15px; height: 15px; cursor: pointer; }
.mobile-nav>ul>li span::before,
.mobile-nav>ul>li span::after{position: absolute; top: 50%; right: 50%; content: '';  background-color: #999;transform: translate(50%,-50%); cursor: pointer; transition: .3s; }
.mobile-nav>ul>li span::before{width: 100%; height: 1px;}
.mobile-nav>ul>li span::after{width: 1px; height: 100%;}
.mobile-nav>ul>li>a{display: inline-block; padding: 15px 0;}
@media (max-width:480px) {
    
}
/* .sub-menu */
.mobile-nav .sub-menu{background-color: #f5f5f5; border-top: 1px solid #eee; transition: none; display: none;}
.mobile-nav .sub-menu li a{display: inline-block; font-size: 12px; line-height: 2.8; opacity: 0; visibility: hidden;}

/* active */
.active-mobile-backgroud{visibility: visible; opacity: 1;}
.active-mobile-nav-scroll{visibility: visible; opacity: 1; transform: translateX(0);}
.active-menu-span::after{height: 0!important; opacity: 0;}
.active-sub-menu li a{transform: translateX(15px); opacity: 1!important; visibility: visible!important; transition: .6s; transition-delay: .1s;}

/*  */
.header-fixed {}

.m-link {
    margin-top: auto;
    position: absolute;
    bottom: 5%;
    right: 20px;
}
.m-link a {
    font-size: 16px;
}

/* alert-search */
.alert-search{position: fixed;top: 0;left: 0;z-index: 1000; width: 100%;height: 100%; background-color: rgba(0,0,0,.7);  visibility: hidden; opacity: 0; transition: .6s;}
.alert-search-box {width: 100%; height: auto; padding: 50px 0; background-color: #fff ;transform: translateY(-10px);visibility: hidden;opacity: 0; transition: .6s;}
.alert-search-box .img{max-width: 150px; text-align: center; margin: 0 auto 25px;}
.alert-search-box .img img{max-width: 100%;}
/* form */
.alert-search-form {max-width: 600px; margin: 0 auto; padding: 0 15px;}
.alert-search-form form{display: flex; justify-content: space-between; align-items: center;}
.alert-search-form input { flex: 1; padding:0 10px; background: none;border: 1px solid var(--default);line-height: 44px;color: #777;font-size: 12px;outline: none;}
.alert-search-form button {width: 120px; border: 1px solid var(--default); line-height: 42px;font-size: 16px;background-color: var(--default);color: #fff;outline: none;}

@media (max-width:768px) {
    .alert-search-box {height: 100%;}
    .alert-search-form input {line-height: 35px;font-size: 14px;}
    .alert-search-form button {width: 80px; line-height: 35px;font-size: 14px;}
}
.close-alert-search {position: absolute;top: 45px;right: 45px;width: 35px;height: 35px;cursor: pointer;}
.close-alert-search span {position: absolute;top: 17px;left: 6px;width: 25px;height: 2px;background-color: #333;}
.close-alert-search span:first-child {transform: rotate(45deg);}
.close-alert-search span:last-child {transform: rotate(-45deg);}
@media (max-width:768px) {
    .close-alert-search {top: 15px;right: 15px;width: 35px;height: 35px;cursor: pointer;}
}
.alert-search-show {visibility: visible; opacity: 1; transform: translateY(0);}




/* =================footer================ */
.footer{  background-color: #000033;}
.footer>.container>.flex{justify-content: space-between;}
.footer-title{padding-bottom: 30px; color: #fff; text-transform: uppercase;}
.footer-left{width: 80%; justify-content: space-between;}
.footer-about{max-width: 285px;}
.footer-about h2{font-weight: bold; color: #fff;}
.footer-about p{ margin-bottom: 15px; line-height: 24px; color: #999;}

.footer-group{}
.footer-group-swiper{height: 120px; overflow: hidden;}
.footer-group-swiper .swiper-container{height: 100%;}
.footer-group-swiper .swiper-slide{ padding-right: 4px; height: auto; }
.footer-group-swiper .swiper-slide{ padding-right: 20px;}
.footer-group-swiper .swiper-slide a{display: block; color: #999; line-height: 30px;}
.footer-group-swiper .swiper-scrollbar{width: 3px!important;}
.footer-group-swiper .swiper-scrollbar {background-color: #808099;}
.footer-group-swiper .swiper-scrollbar .swiper-scrollbar-drag{background-color: #fff;}

.footer-contact{padding: 0 30px; }
.footer-contact ul li{display: block; margin-bottom: 10px; color: #999; line-height: 24px;}


.footer-info{text-align: right;}
.footer-qr{ margin-top: 30px; justify-content: flex-end; align-items: center; }
.footer-qr img{max-width: 140px; margin-left: 10px;}
.footer-qr p{line-height: 30px; color: #999;}
.footer-tel h3{ margin-bottom: 5px; font-size: 30px; font-weight: bold; color: #fff; }
.footer-tel p{font-size: 12px; color: #999; padding: 5px 0;}

@media (max-width:1420px) {
    .footer-left{width: 100%; justify-content: space-between;}
    .footer-info{ margin: 20px 0 0; }
    .footer-qr{ margin-top: 10px; justify-content: center; align-items: center; }
/*        .footer-qr p{display: none;}
    .footer-qr img{margin: 0;} */
}

@media (max-width:1200px) {
    
}

@media (max-width:1100px) {
    .footer-title{ padding-bottom: 15px;}
}

@media (max-width:768px) {
    .footer-about{display: none;}
    .footer-group,
    .footer-contact{ width: 100%; margin-bottom: 25px; padding: 0;}
    
    .footer-about p{ margin-top: 5px; line-height: 24px;}
    .footer-contact ul li{ margin-bottom: 5px; color: #999; line-height: 20px;}
}

/*  */
.footer-tag {padding:0;background-color: #010123;}
.footer-tag ul li {float: left;margin-right: 10px;color: #ccc;line-height: 30px;}
.footer-tag ul li a {color: #999;}
.footer-tag ul li a:hover {color: #fff;}

.site-copyright { padding: 10px 0; border-top: 1px solid #1B1B39; background-color: #010123;}
.site-copyright p{line-height: 24px;font-size: 12px; color: #999;}
.site-copyright p.flex{justify-content: space-between;}
.site-copyright a{ color: #999;}
.site-copyright a:hover{ color: #fff;}

@media (max-width:1200px) {
	.site-copyright p span{display: block;}
}
@media (max-width:640px) {
	.site-copyright p:last-child{display: block;}
}


.join-tip {text-align: center;font-size: 16px;margin-top: 50px;}
.join-tip a {font-weight: 900;color: var(--default);}
.join-tip a i {transform: rotate( -45deg); display: inline-block;color: var(--default);}
/*  */

@media (max-width:640px) {
    .join-tip {margin-top: 30px;}
}


.item-animate li:nth-child(1){animation-delay: .1s;}
.item-animate li:nth-child(2){animation-delay: .2s;}
.item-animate li:nth-child(3){animation-delay: .3s;}
.item-animate li:nth-child(4){animation-delay: .4s;}
.item-animate li:nth-child(5){animation-delay: .5s;}
.item-animate li:nth-child(6){animation-delay: .6s;}
.item-animate li:nth-child(7){animation-delay: .7s;}
.item-animate li:nth-child(8){animation-delay: .8s;}
.item-animate li:nth-child(9){animation-delay: .9s;}
.item-animate li:nth-child(10){animation-delay: 1s;}
.item-animate li:nth-child(11){animation-delay: 1.1s;}
.item-animate li:nth-child(12){animation-delay: 1.2s;}
.item-animate li:nth-child(13){animation-delay: 1.3s;}
.item-animate li:nth-child(14){animation-delay: 1.4s;}
.item-animate li:nth-child(15){animation-delay: 1.5s;}
.item-animate li:nth-child(16){animation-delay: 1.6s;}


